﻿
@model IEnumerable<HomeStayWebCP.Models.BusinessObject.UserInfo>
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
                    // WebGrid grid = new WebGrid(Model,rowsPerPage:5);
}
<!DOCTYPE html>
<html>
<head>
    <script src="../../Scripts/jquery-1.8.2.js" type="text/javascript"></script>
    <link href="../../Content/Datatable/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="../../Content/Datatable/jquery.dataTables.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            var oTable = $('#myDataTable').dataTable({
                "oLanguage": {
                    "sSearch": "Search by Username, Role or Status"
                },
                "bServerSide": true,
                "sAjaxSource": "DatatableListUsers",
                "sPaginationType": "full_numbers",
                "bProcessing": true,
                "aoColumns": [
                    { "sName": "Username",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[0];
                            return '<a href="/ManageUsers/ViewUserDetail?uName=' + rendered + '">' + rendered + '</a>';
                        }
                    },
                    { "sName": "Fullname",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[1];
                            return rendered;
                        }

                    },
                    { "sName": "Role",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[2];
                            return rendered;
                        }
                    },
                    { "sName": "Email",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[3];
                            return rendered;
                        }
                    },
                    { "sName": "Phone",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[4];
                            return rendered;
                        }
                    },
                    {
                        "sName": "Status",
                        "fnRender": function (obj) {
                            var rendered = obj.aData[5];
                            return rendered;
                        }
                    }
                ]
            });
        });
    </script>
    <style type="text/css">
        #manageuser  {
            color: #5b0f32;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="container">
        <div id="demo">
            <h2>User Management</h2>
            <table id="myDataTable" class="display">
                <thead>
                    <tr>
                        <th>
                            Username
                        </th>
                        <th>
                            Fullname
                        </th>
                        <th>
                            Role
                        </th>
                        <th>
                            Email
                        </th>
                        <th>
                            Phone
                        </th>
                        <th>
                            Status
                        </th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</body>
</html>
